<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!-- 导入 jquery 核心类库 -->
			<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
			<!-- 导入 easyui 类库 -->
			<script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
			<!– 导入默认主题 CSS 文件-->
			<link id="easyuiTheme" rel="stylesheet" type="text/css" href="../js/easyui/themes/default/easyui.css">
			<!– 导入图标 CSS 文件-->
			<link rel="stylesheet" type="text/css" href="../js/easyui/themes/icon.css">
			<!– 导入国际化信息文件-->
			<script src="../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
			<script src="../js/ztree/jquery.ztree.all-3.5.js"  charset="utf-8" type="text/javascript"></script>
			<link rel="stylesheet" type="text/css" href="../js/ztree/zTreeStyle.css"/>
			<script type="text/javascript">
				$(function(){
					$("#grid").datagrid({
						columns:[[  //二位数组，表头
							{field:'id',title:'Code',width:100}, 
							{field:'name',title:'商品名称',width:100},
							{field:'price',title:'价格',width:100}
						]],
						
						//url:"product.json",
					
						url : 'product.json' ,
						pagination:true,
						toolbar:[
							{
								id:"saveBtu",
								text:"保存",
								iconCls:"icon-save",
								handler:function(){
									alert("保存");
								}
							}
						]
					});
				});
			</script>
	</head>
	<body>
		<div id="grid"></div>
	</body>
</html>
